import React from 'react';
import ListLoading from 'atComponents/ListLoading';
import ErrorPage from 'components/errorPage';
import intl from '../../../locale';

const Loading = (props) => {
  if (props.error) {
    // console.error(props.error);
    // When the loader has errored
    return (
      <ErrorPage
        errorCode={'NOT_FOUND'}
        errorMessage={intl.get({
          id: 'code-assets.loadable.loading.UnableToLoadResources',
          defaultMessage: '资源加载失败',
        })}
        errorAction={intl.get({
          id: 'code-assets.loadable.loading.YouCanRefreshThePage',
          defaultMessage: '您可以刷新页面重试或联系答疑人员寻求帮助',
        })}
      />
    );
  } else if (props.timedOut) {
    // When the loader has taken longer than the timeout
    return <div>Taking a long time...</div>;
  } else if (props.pastDelay) {
    // When the loader has taken longer than the delay
    return <ListLoading style={{ marginTop: 100 }} />;
  } else {
    // When the loader has just started
    return null;
  }
};

export default Loading;
